<template>
  <div>
    <h1>发送ajax请求</h1>
    <button @click="handlerGet">get请求</button>
    <button @click="handlerPost">post请求</button>
    <button @click="handlerPut">put请求</button>
    <button @click="handlerPatch">patch请求</button>
    <button @click="handlerDelete">delete请求</button>
    <button @click="handlerPostHeader">测试post请求头</button>
    <button @click="handlerSeat">获取卖座电影数据</button>
  </div>
</template>
<script>
export default {
  methods: {
    // 获取卖座电影数据
    handlerSeat() {
      this.$http
        .get("https://m.maizuo.com/gateway", {
          params: {
            cityId: 440300,
            pageNum: 1,
            pageSize: 10,
            type: 1,
            k: 5006319,
          },
          // 自定义请求头
          headers: { 
              "X-Client-Info": '{"a":"3000","ch":"1002","v":"5.2.1","e":"1706499812185314953920513","bc":"110100"}',
              "X-Host":"mall.film-ticket.film.list"
          },
        })
        .then((result) => {
          console.log(result);
        });
    },
    handlerGet() {
      // 获取全部数据
      // this.$http({
      //   url: "http://localhost:3000/stus",
      // }).then((result) => {
      //   console.log(result);
      // });
      // 通过id 获取请求
      this.$http({
        // 真是的访问地址即使 baseURL + url
        // baseURL: "http://localhost:3000",
        url: "/stus",
        // get 或者delete 请求参数携带的位置
        params: {
          id: 1002,
        },
      }).then((result) => {
        console.log(result);
      });
    },
    handlerPost() {
      this.$http({
        // baseURL: "http://localhost:3000",
        url: "/stus",
        method: "post",
        // post/patch/put 携带的参数
        data: {
          id: "1005",
          name: "小强",
          age: 18,
        },
      }).then((result) => {
        console.log(result);
      });
    },
    handlerPut() {
      this.$http({
        // baseURL: "http://localhost:3000",
        url: "/stus/1005",
        method: "put",
        // post/patch/put 携带的参数
        data: {
          name: "小强1",
        },
      }).then((result) => {
        console.log(result);
      });
    },
    handlerPatch() {
      this.$http({
        // baseURL: "http://localhost:3000",
        url: "/stus/1005",
        method: "patch",
        // post/patch/put 携带的参数
        data: {
          name: "小强1",
        },
      }).then((result) => {
        console.log(result);
      });
    },
    handlerDelete() {
      this.$http({
        //baseURL: "http://localhost:3000",
        url: "/stus/1005",
        method: "delete",
      }).then((result) => {
        console.log(result);
      });
    },
    handlerPostHeader() {
      this.$http({
        // baseURL: "http://localhost:3000",
        url: "https://httpbin.org/post",
        method: "post",
        // post/patch/put 携带的参数
        data: {
          username: "admin",
          password: "123456",
        },
      }).then((result) => {
        console.log(result);
      });
    },
  },
};
</script>

<style></style>
